<template>
  <Viewer :value="text" :plugins="plugins" />
</template>

<script lang="ts" setup>
import 'bytemd/dist/index.css'
import gfm from '@bytemd/plugin-gfm'
import highlight from '@bytemd/plugin-highlight'
import { Viewer } from '@bytemd/vue-next'

const text = defineModel()
const plugins = [
  gfm(),
  // Add more plugins here
  highlight(),
]
</script>

<style lang="scss" scoped>
:deep(.bytemd-toolbar-icon.bytemd-tippy.bytemd-tippy-right:last-child) {
  display: none;
}
</style>
